<!DOCTYPE html>
<html lang="en">
<%@page import="karaokestrong.modelo.Sala"%>
<%@page import="karaokestrong.negocio.GestionSala,java.util.*"%>
<%@page import="karaokestrong.negocio.GestionCliente"%>

<%@ page contentType="text/html; charset=utf-8" language="java"
	import="java.sql.*" errorPage=""%>

<%@page import="karaokestrong.modelo.Cliente"%>
<%@page import="karaokestrong.modelo.Administrador"%>

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">

<title>Karaoke Strong</title>

<script src="js/jquery-1.10.2.js"></script>
<script src="js/jquery-ui-1.10.3.js"></script>
<script src="js/bootstrap.js"></script>

<!-- Le styles -->
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/bootstrap-responsive.css" rel="stylesheet">
<link href="css/bootswatch.css" rel="stylesheet">
<link href="css/jquery-ui-1.10.3.css" rel="stylesheet">

<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

</head>



<body class="preview">

	<%
		GestionCliente neg = new GestionCliente();
		Collection<Cliente> todos = neg.ListarCliente();
		request.setAttribute("ListadoLocal", todos);
	%>

	<%
		GestionSala negsalas = new GestionSala();
		Collection<Sala> lsalas = negsalas.listarSala();
		request.setAttribute("ListadoLocal", lsalas);
	%>


	<div class="navbar navbar-inverse navbar-fixed-top">
		<div class="navbar-inner">
			<div class="container">
				<a class="btn btn-navbar" data-toggle="collapse"
					data-target=".nav-collapse"> <span class="icon-bar"></span> <span
					class="icon-bar"></span> <span class="icon-bar"></span>
				</a> <a class="brand" href="index.jsp">Sistema de Karaoke Strong</a>
				<div class="nav-collapse collapse">
					<ul class="nav">
						<li class="active"><a href="#">Bienvenidos</a></li>
						<li><a href="#about">Acerca</a></li>
						<li><a href="#contact">Contactanos</a></li>
						<li class="dropdown"><a href="#" class="dropdown-toggle"
							data-toggle="dropdown">Opciones <b class="caret"></b></a>
							<ul class="dropdown-menu">
								<li><a href="formlocal.jsp">Reservar Local</a></li>
								<li><a href="/KaraokeStrong/BuscarProductosServlet">Buscador
										Productos Movil</a></li>
								<li><a href="#"></a></li>
								<li><a href="formProductoInsertar.jsp"></a></li>
								<li class="divider"></li>

							</ul></li>
					</ul>
					<form class="navbar-form pull-right">
						<input class="span2" type="text" placeholder="Email"> <input
							class="span2" type="password" placeholder="Password">
						<button type="submit" class="btn">Sign in</button>
					</form>
				</div>
				<!--/.nav-collapse -->
			</div>
		</div>
	</div>

	<div class="container">

		<!-- Main hero unit for a primary marketing message or call to action -->
		<div class="hero-unit">
			<h1>Haga su Reserva</h1>
		</div>

		<form id="formreserva" name="formreserva"
			action="ServletReservaInsertar" method="post"
			class="form-horizontal well">


			<fieldset>
			
				<script type="text/javascript">
				function validar(obj) {
				  patron = /^\d{4}\/\d{2}\/\d{2}$/
					  if (!patron.test(obj.value)) {
							alert('Intoduce la fecha bien:YYYY-MM-DD');
							fecha.focus();
							return (false);
							}
				  
				}
				
				
				</script>
				
			

				<div class="control-group">
					<label class="control-label" for="input01">Fecha y Hora :</label>
					<div class="controls">
						<input type="datetime" name="fechayhora" id="fechayhora" size="25" onblur="validar(this)" required>
					</div>
				</div>




				<div class="control-group">
					<label class="control-label" for="textarea">Descripción:</label>
					<div class="controls">
						<textarea name="descripcion" class="input-xlarge" id="descripcion"
							rows="3" required></textarea>
					</div>
				</div>

				<div class="control-group">
					<label class="control-label" for="select01">Id Sala :</label>
					<div class="controls">
						<select name="txtsala" id="txtsala">
							<option value="0">Seleccione</option>
							<%
								for (Sala s : lsalas) {
									out.println("<option value=" + s.getIdsala() + ">"
											+ s.getNombre() + "</option>");
								}
							%>
						</select>
					</div>
				</div>


				<div class="control-group">
					<label class="control-label" for="select01">Id Cliente :</label>
					<div class="controls">
						<select name="txtId" id="txtId">
							<option value="0">Seleccione</option>
							<%
								for (Cliente c : todos) {
									out.println("<option value=" + c.getIdcliente() + ">"
											+ c.getNombres() + "</option>");
								}
							%>
						</select>
					</div>
				</div>


				<div class="form-actions">
					<button type="submit" name="Submit" class="btn btn-primary">Enviar</button>
					<button type="reset" class="btn">Cancelar</button>
				</div>

			</fieldset>
		</form>



		<footer>
			<p>&copy; Desarrollo Web 2013</p>
		</footer>

	</div>
	<!-- /container -->

</body>

</html>